@charset "UTF-8";
.show-data{
  position: relative;
  width: 1653px;
  height: 766px;
  background: #fff;
  margin-left: auto;
  margin-right: auto;
  transform: translate3d(0,0,0);
  &.bg{
    background-image: url("../images/bg.png");
  }
}
.server-list{
  @include clearfix;
  .server-item{
    float: left;
    text-align: center;
    padding: 10px 0;
  }
  .server-pic{
    img{
      display: inline-block;
      width: 40px;
      height: 30px;
      vertical-align: top;
    }
  }
  .server-text{
    text-align: center;
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    color: #666;
  }
  .server-text-line2{
    height: 40px; 
  }
}

.server-list01{
  .server-item{
    width: 50px;
  }
}
.server-list02{
  .server-item{
    width: 60px;
  }
}
.server-list03{
  .server-item{
    width: 70px;
  }
}
.server-list04{
  .server-item{
    width: 80px;
  }
}
.server-list05{
  .server-item{
    width: 90px;
  }
}
.server-list06{
  .server-item{
    width: 100px;
  }
}
.server-list-main{
  height: 210px;
  .server-item{
    width: 100%;
    height: 105px;
    padding: 16px 0;
  }
  .server-pic img{
    width: 40px;
    height: 50px;
  }
}


// 总公司服务器 至 路局服务器
.line-server01{
  position: absolute;
  left: 20px;
  top: 195px;
  // height: 75px;
  width: 920px;
  //上方竖线
  .line-to-top{
    height: 41px;
    .star{
      transform: translateY(-30px);
    }
  }
  //中间横线
  .line-horizontal{
    top: 41px;
  }
  //下方竖线
  .line-vertical{
    top: 41px;
    left: 460px;
    height: 34px;
  }
  .line-item-01{
    .line-to-top{
      left: 35px;
    }
    .line-horizontal{
      left: 35px;
      width: 425px;
    }
  }
  .line-item-02{
    .line-to-top{
      left: 85px;
    }
    .line-horizontal{
      left: 85px;
      width: 375px;
    }
  }
  .line-item-03{
    .line-to-top{
      left: 135px;
    }
    .line-horizontal{
      left: 135px;
      width: 325px;
    }
  }
  .line-item-04{
    .line-to-top{
      left: 185px;
    }
    .line-horizontal{
      left: 185px;
      width: 275px;
    }
  }
  .line-item-05{
    .line-to-top{
      left: 235px;
    }
    .line-horizontal{
      left: 235px;
      width: 225px;
    }
  }
  .line-item-06{
    .line-to-top{
      left: 285px;
    }
    .line-horizontal{
      left: 285px;
      width: 175px;
    }
  }
  .line-item-07{
    .line-to-top{
      left: 335px;
    }
    .line-horizontal{
      left: 335px;
      width: 125px;
    }
  }
  .line-item-08{
    .line-to-top{
      left: 385px;
    }
    .line-horizontal{
      left: 385px;
      width: 75px;
    }
  }
  .line-item-09{
    .line-to-top{
      left: 435px;
    }
    .line-horizontal{
      left: 435px;
      width: 25px;
    }
  }
  .line-item-10{
    .line-to-top{
      right: 435px;
    }
    .line-horizontal{
      left: auto;
      right: 435px;
      width: 25px;
    }
  }
  .line-item-11{
    .line-to-top{
      right: 385px;
    }
    .line-horizontal{
      left: auto;
      right: 385px;
      width: 75px;
    }
  }
  .line-item-12{
    .line-to-top{
      right: 335px;
    }
    .line-horizontal{
      left: auto;
      right: 335px;
      width: 125px;
    }
  }
  .line-item-13{
    .line-to-top{
      right: 285px;
    }
    .line-horizontal{
      left: auto;
      right: 285px;
      width: 175px;
    }
  }
  .line-item-14{
    .line-to-top{
      right: 235px;
    }
    .line-horizontal{
      left: auto;
      right: 235px;
      width: 225px;
    }
  }
  .line-item-15{
    .line-to-top{
      right: 185px;
    }
    .line-horizontal{
      left: auto;
      right: 185px;
      width: 275px;
    }
  }
  .line-item-16{
    .line-to-top{
      right: 135px;
    }
    .line-horizontal{
      left: auto;
      right: 135px;
      width: 325px;
    }
  }
  .line-item-17{
    .line-to-top{
      right: 85px;
    }
    .line-horizontal{
      left: auto;
      right: 85px;
      width: 375px;
    }
  }
  .line-item-18{
    .line-to-top{
      right: 35px;
    }
    .line-horizontal{
      left: auto;
      right: 35px;
      width: 425px;
    }
  }
  // 主线
  .line-item-main{
    position: absolute;
    top: 41px;
    left: 0;
    right: 0;
    .line-to-left{
      left: 35px;
      right: 50%;
      .star{
        transform: translateX(-400px);
        animation-duration: 4s;
      }
    }
    .line-to-right{
      left: 50%;
      right: 35px;
      .star{
        transform: translateX(400px);
        animation-duration: 4s;
      }
    }
    .line-to-top{
      left: 460px;
      height: 34px;
      .star{
        transform: translateY(-22px);
        animation-duration: .7s;
      }
    }
  }
}
// 路局服务器 内部线
.line-server01-inner{
  position: absolute;
  left: 20px;
  top: 122px;
  height: 22px;
  width: 920px;
  .line-vertical-group{
    position: absolute;
    top: 0;
  }
  .line-item-01{
    left: 30px;
  }
  .line-item-02{
    left: 80px;
  }
  .line-item-03{
    left: 130px;
  }
  .line-item-04{
    left: 180px;
  }
  .line-item-05{
    left: 230px;
  }
  .line-item-06{
    left: 280px;
  }
  .line-item-07{
    left: 330px;
  }
  .line-item-08{
    left: 380px;
  }
  .line-item-09{
    left: 430px;
  }
  .line-item-10{
    left: 480px;
  }
  .line-item-11{
    left: 530px;
  }
  .line-item-12{
    left: 580px;
  }
  .line-item-13{
    left: 630px;
  }
  .line-item-14{
    left: 680px;
  }
  .line-item-15{
    left: 730px;
  }
  .line-item-16{
    left: 780px;
  }
  .line-item-17{
    left: 830px;
  }
  .line-item-18{
    left: 880px;
  }
}
// 总公司服务器 至 一中心数据服务器
.line-server02{
  position: absolute;
  top: 395px;
  left: 400px;
  width: 30px;
  .star{
    animation-duration: 1s;
    transform: translateX(-18px);
  }
}

// 总公司服务器 至 二中心数据服务器
.line-server03{
  position: absolute;
  top: 395px;
  left: 532px;
  width: 30px;
  .star{
    animation-duration: 1s;
    transform: translateX(18px);
  }
}
// 总公司服务器 内部线
.line-server04{
  position: absolute;
  top: 390px;
  left: 474px;
  .line-vertical-group{
    height: 30px;
  }
}
// 二中心数据服务器 至 ALI_DS
.line-server05{
  position: absolute;
  top: 303px;
  left: 723px;
  width: 30px;
  .star{
    animation-duration: 1s;
    transform: translateX(20px);
  }
}
// ALI_DS 至 ALI_REP
.line-server06{
  position: absolute;
  top: 338px;
  left: 775px;
  height: 40px;
  .star{
    animation-duration: 1s;
    transform: translateY(30px);
  }
}
// ALI_REP 至 线上/线下余票群
.line-server07{
  position: absolute;
  top: 430px;
  left: 775px;
  .line-to-bottom{
    height: 160px;
    .star{
      animation-duration: 2s;
      transform: translateY(140px);
    }
  }
  .line-to-right{
    top: 160px;
    width: 62px;
    .star{
      transform: translateX(45px);
    }
  }
}
// 一中心复制服务器 二中心复制服务器 至 线上/线下余票群
.line-server08{
  position: absolute;
  top: 440px;
  left: 150px;
  .line-item-01{
    .line-to-top{
      top: 108px;
      left: 0;
      height: 20px;
      .star{
        animation-duration: .6s;
        transform: translateY(-10px);
      }
    }
    .line-to-top2{
      top: 0;
      left: 580px;
      height: 109px;
    }
    .line-to-right{
      top: 108px;
      width: 580px;
    }
    .line-to-right2{
      left: 580px;
      top: 0;
      width: 450px;
    }
  }
  .line-item-02{
    .line-to-top{
      top: 108px;
      left: 315px;
      height: 20px;
      .star{
        animation-duration: .6s;
        transform: translateY(-10px);
      }
    }
    .line-to-top2{
      top: 0;
      left: 580px;
      height: 109px;
    }
    .line-to-right{
      left: 315px;
      top: 108px;
      width: 265px;
    }
    .line-to-right2{
      left: 580px;
      top: 0;
      width: 450px;
    }
  }
  .line-main{
    .line-to-right{
      top: 108px;
      width: 580px;
      .star{
        animation-duration: 4s;
        transform: translateX(560px);
      }
    }
    .line-to-top{
      top: 0;
      left: 580px;
      height: 109px;
      .star{
        animation-duration: 1.5s;
        transform: translateY(-90px);
      }
    }
    .line-to-right2{
      left: 580px;
      top: 0;
      width: 450px;
      .star{
        animation-duration: 3s;
        transform: translateX(420px);
      }
    }
  }
}
// 线上/线下余票群 内部线
.line-server09{
  position: absolute;
  width: 360px;
  top: 440px;
  left: 850px;
  .line-item{
    position: absolute;
    width: 1px;
    height: 18px;
    .star{
      transform: translateY(10px);
    }
  }
  .line-item-01{
    top: 0;
    left: 29px;
    height: 11px;
  }
  .line-item-02{
    top: 0;
    left: 89px;
    height: 11px;
  }
  .line-item-03{
    top: 0;
    left: 149px;
    height: 11px;
  }
  .line-item-04{
    top: 0;
    left: 209px;
    height: 11px;
  }
  .line-item-05{
    top: 0;
    left: 269px;
    height: 11px;
  }
  .line-item-06{
    top: 0;
    left: 329px;
    height: 11px;
  }
  .line-item-07{
    top: 60px;
    left: 29px;
  }
  .line-item-08{
    top: 60px;
    left: 89px;
  }
  .line-item-09{
    top: 60px;
    left: 149px;
  }
  .line-item-10{
    top: 60px;
    left: 209px;
  }
  .line-item-11{
    top: 60px;
    left: 269px;
  }
  .line-item-12{
    top: 60px;
    left: 329px;
  }
  .line-item-13{
    top: 130px;
    left: 29px;
  }
  .line-item-14{
    top: 130px;
    left: 89px;
  }
  .line-item-15{
    top: 130px;
    left: 149px;
  }
  .line-item-16{
    top: 130px;
    left: 209px;
  }
  .line-item-17{
    top: 130px;
    left: 269px;
  }
  .line-item-18{
    top: 130px;
    left: 329px;
  }
  .line-item-19{
    top: 220px;
    left: 29px;
  }
  .line-item-20{
    top: 220px;
    left: 89px;
  }
  .line-item-21{
    top: 220px;
    left: 149px;
  }
  .line-item-22{
    top: 220px;
    left: 209px;
  }
  .line-item-23{
    top: 220px;
    left: 269px;
  }
  .line-item-24{
    top: 220px;
    left: 329px;
  }
}
// 席位集中复制服务器 至 二中心数据服务器
.line-server10{
  position: absolute;
  top: 284px;
  left: 725px;
  width: 210px;
  .star{
    animation-duration: 2s;
    transform: translateX(-190px)
  }
}
// 席位集中复制服务器 至 总公司服务器
.line-server11{
  position: absolute;
  top: 330px;
  left: 940px;
  .line-to-left{
    left: auto;
    width: 120px;
    .star{
      animation-duration: 1s;
      transform: translateX(-100px);
    }
  }
  .line-to-bottom{
    right: 120px;
    height: 200px;
    .star{
      animation-duration: 3s;
      transform: translateY(180px);
    }
  }
  .line-to-left2{
    top: 200px;
    right: 120px;
    width: 340px;
    .star{
      animation-duration: 3.5s;
      transform: translateX(-320px);
    }
  }
  .line-to-top{
    right: 460px;
    height: 21px;
    top: 180px;
    .star{
      transform: translateY(-12px);
    }
  }
}
// 席位集中复制服务器 至 一中心数据服务器
.line-server12{
  position: absolute;
  top: 250px;
  left: 1110px;
  .line-to-top{
    left: 0;
    top: 0;
    height: 20px;
    .star{
      transform: translateY(-12px);
    }
  }
  .line-to-left{
    top: 0;
    left: auto;
    width: 900px;
    .star{
      animation-duration: 6s;
      transform: translateX(-880px);
    }
  }
  .line-to-bottom{
    left: auto;
    right: 900px;
    top: 0;
    height: 20px;
    .star{
      transform: translateY(12px);
    }
  }
}
// 席位集中主服务器 至 席位集中余票库
.line-server13{
  position: absolute;
  top: 208px;
  right: 170px;
  .line-to-bottom{
    height: 62px;
    .star{
      animation-duration: 1s;
      transform: translateY(50px);
    }
  }
}
// 席位集中余票库 至 席位集中复制服务器 
.line-server14{
  position: absolute;
  top: 324px;
  right: 321px;
  .line-to-left{
    left: auto;
    width: 50px;
    .star{
      animation-duration: 1s;
      transform: translateX(-38px);
    }
  }
}
// 席位集中主服务器 至 席位集中余票库
.line-server15{
  position: absolute;
  bottom: 338px;
  right: 170px;
  .line-to-top{
    height: 48px;
    top: auto;
    .star{
      animation-duration: 1s;
      transform: translateY(-35px);
    }
  }
}
// 席位集中备服务器 内部线
.line-server16{
  position: absolute;
  width: 350px;
  bottom: 245px;
  right: 30px;
  .line-item{
    position: absolute;
    width: 1px;
    height: 18px;
  }
  .line-item-01{
    top: 0;
    left: 35px;
  }
  .line-item-02{
    top: 0;
    left: 105px;
  }
  .line-item-03{
    top: 0;
    left: 175px;
  }
  .line-item-04{
    top: 0;
    left: 245px;
  }
  .line-item-05{
    top: 0;
    left: 315px;
  }
  .line-item-06{
    top: 140px;
    left: 35px;
  }
  .line-item-07{
    top: 140px;
    left: 105px;
  }
  .line-item-08{
    top: 140px;
    left: 175px;
  }
  .line-item-09{
    top: 140px;
    left: 245px;
  }
}
// 席位集中主服务器 内部线
.line-server17{
  position: absolute;
  width: 350px;
  top: 120px;
  left: 983px;
  // height: 140px;
  // background: #f00;
  .line-item{
    position: absolute;
    width: 1px;
    height: 18px;
    top: 0;
  }
  .line-item-01{
    left: 40px;
  }
  .line-item-02{
    left: 120px;
  }
  .line-item-03{
    left: 200px;
  }
  .line-item-04{
    left: 280px;
  }
  .line-item-05{
    left: 360px;
  }
  .line-item-06{
    left: 440px;
  }
  .line-item-07{
    left: 520px;
  }
  .line-item-08{
    left: 600px;
  }
}
/*新增页面*/
.sybase-list{
  @include clearfix;
  &.sybase-list01{
    display: flex;
    width: 412px;
    align-items: center;
  }
  &.sybase-list02{
    display: flex;
    width: 424px;
    align-items: center;
    .sybase-item{
      //width: 56px;
      &:last-child{
        .sybase-text{
          width:auto;
          white-space: nowrap;
        }
      };
    }
  }
  .sybase-item{
    //float: left;
    flex:1;
    text-align: center;
    padding: 0px 0;
    width: 56px;
  }
  .sybase-pic{
    img{
      display: inline-block;
      width: 46px;
      height: 46px;
      vertical-align: top;
    }
  }
  .sybase-text{
    text-align: center;
    //height: 40px;
    width: 56px;
    margin:0 auto;
    line-height: 20px;
    //overflow: hidden;
    font-size: 14px;
  }
}
.sybase-list01{
  .server-item{
    width: 50px;
  }
}
//AD 至 D8主
.line-base01{
  position: absolute;
  top: 177px;
  left: 372px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
  .line-to-bottom{
    top: 0px;
    left: 32px;
    height: 94px;
    .star{
      animation-duration: 1s;
      transform: translateY(84px);
    }
  }
  .line-to-right2{
    top: 94px;
    left: 32px;
    width: 56px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}

//AD-mq
.line-base39{
  position: absolute;
  top: 178px;
  left: 97px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//mq-xiaofei
.line-base40{
  position: absolute;
  top: 178px;
  left: 233px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//AT-mq
.line-base41{
  position: absolute;
  top: 378px;
  left: 97px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//mq-xiaofei
.line-base42{
  position: absolute;
  top: 378px;
  left: 233px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//AT 至 D8主
.line-base02{
  position: absolute;
  top: 378px;
  left: 372px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 32px;
    height: 94px;
    .star{
      animation-duration: 1s;
      transform: translateY(-84px);
    }
  }
  .line-to-right2{
    bottom: 93px;
    left: 32px;
    width: 56px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}
//D8主-1
.line-base03{
  position: absolute;
  top: 279px;
  left: 508px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 32px;
    height: 202px;
    .star{
      animation-duration: 1.5s;
      transform: translateY(-192px);
    }
  }
  .line-to-right2{
    bottom: 202px;
    left: 32px;
    width: 54px;
    .star{
      animation-duration: 1s;
      transform: translateX(48px);
    }
  }
}
//D8主01 01
.line-base04{
  position: absolute;
  top: 78px;
  left: 636px;
  .line-to-right{
    width: 88px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主01 02
.line-base05{
  position: absolute;
  top: 78px;
  left: 772px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}

//D8主01 03
.line-base06{
  position: absolute;
  top: 78px;
  left: 910px;
  .line-to-right{
    width: 62px;
    .star{
      animation-duration: 1s;
      transform: translateX(56px);
    }
  }
  .line-to-bottom{
    top: 0px;
    left: 62px;
    height: 200px;
    .star{
      animation-duration: 1s;
      transform: translateY(190px);
    }
  }
  .line-to-right2{
    top: 200px;
    left: 62px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
//D8主-1
.line-base10{
  position: absolute;
  top: 279px;
  left: 508px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 32px;
    height: 100px;
    .star{
      animation-duration: 1s;
      transform: translateY(-90px);
    }
  }
  .line-to-right2{
    bottom: 100px;
    left: 32px;
    width: 54px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
}
//D8主01 01
.line-base07{
  position: absolute;
  top: 178px;
  left: 636px;
  .line-to-right{
    width: 88px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 02
.line-base08{
  position: absolute;
  top: 178px;
  left: 772px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 03
.line-base09{
  position: absolute;
  top: 178px;
  left: 912px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
  .line-to-bottom{
    top: 0px;
    left: 60px;
    height: 100px;
    .star{
      animation-duration: 1s;
      transform: translateY(90px);
    }
  }
  .line-to-right2{
    top: 100px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
//D8主-3
.line-base11{
  position: absolute;
  top: 279px;
  left: 508px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-bottom{
    left: 32px;
    height: 66px;
    .star{
      animation-duration: 1s;
      transform: translateY(56px);
    }
  }
  .line-to-right2{
    top: 0px;
    left: 32px;
    width: 54px;
    .star{
      animation-duration: 1s;
      transform: translateX(48px);
    }
  }
}
//D8主01 01
.line-base12{
  position: absolute;
  top: 278px;
  left: 636px;
  .line-to-right{
    width: 88px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 02
.line-base13{
  position: absolute;
  top: 278px;
  left: 772px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 03
.line-base14{
  position: absolute;
  top: 278px;
  left: 912px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 60px;
    height: 100px;
    .star{
      animation-duration: 1s;
      animation-delay: 1s;
      transform: translateY(-90px);
    }
  }
  .line-to-right2{
    bottom: -1px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
//D8主-4
.line-base15{
  position: absolute;
  top: 279px;
  left: 508px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-bottom{
    left: 32px;
    height: 100px;
    .star{
      animation-duration: 1s;
      transform: translateY(90px);
    }
  }
  .line-to-right2{
    top: 100px;
    left: 32px;
    width: 54px;
    .star{
      animation-duration: 1s;
      transform: translateX(48px);
    }
  }
}
//D8主01 01
.line-base16{
  position: absolute;
  top: 378px;
  left: 636px;
  .line-to-right{
    width: 88px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 02
.line-base17{
  position: absolute;
  top: 378px;
  left: 772px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主02 03
.line-base18{
  position: absolute;
  top: 378px;
  left: 912px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 60px;
    height: 100px;
    .star{
      animation-duration: 2s;
      transform: translateY(-90px);
    }
  }
  .line-to-right2{
    bottom: 99px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
//D8主-5
.line-base43{
  position: absolute;
  top: 279px;
  left: 508px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-bottom{
    left: 32px;
    height: 200px;
    .star{
      animation-duration: 1s;
      transform: translateY(190px);
    }
  }
  .line-to-right2{
    top: 200px;
    left: 32px;
    width: 54px;
    .star{
      animation-duration: 1s;
      transform: translateX(48px);
    }
  }
}
//D8主05 01
.line-base44{
  position: absolute;
  top: 478px;
  left: 636px;
  .line-to-right{
    width: 88px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主05 02
.line-base45{
  position: absolute;
  top: 478px;
  left: 772px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8主05 03
.line-base46{
  position: absolute;
  top: 478px;
  left: 912px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 60px;
    height: 200px;
    .star{
      animation-duration: 2s;
      transform: translateY(-190px);
    }
  }
  .line-to-right2{
    bottom: 199px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
//D8主 - D8从
.line-base19{
  position: absolute;
  top: 437px;
    left: 421px;
  .line-to-bottom{
    top: -112px;
    left: 62px;
    height: 162px;
    .star{
      animation-duration: 1s;
      transform: translateY(154px);
    }
  }
}
//D8从-fd
.line-base20{
  position: absolute;
      top: 400px;
    left: 483px;
  .line-to-right{
    width: 33px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
  .line-to-bottom{
    left: 33px;
    height: 230px;
    .star{
      animation-duration: 2.5s;
      transform: translateY(222px);
    }
  }
  .line-to-right2{
    top: 230px;
    left: 34px;
    width: 77px;
    .star{
      animation-duration: 1s;
      transform: translateX(68px);
    }
  }
}
//D8从-1
.line-base21{
  position: absolute;
  top: 628px;
  left: 635px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(22px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 32px;
    height: 50px;
    .star{
      animation-duration: 1s;
      transform: translateY(-40px);
    }
  }
  .line-to-right2{
    bottom: 50px;
    left: 33px;
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(52px);
    }
  }
}
.line-base22{
  position: absolute;
  top: 577px;
  left: 769px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
.line-base23{
  position: absolute;
  top: 577px;
  left: 913px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//D8从-2
.line-base24{
  position: absolute;
  top: 628px;
  left: 635px;
  .line-to-right{
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(22px);
    }
  }
  .line-to-bottom{
    left: 32px;
    height: 52px;
    .star{
      animation-duration: 1s;
      transform: translateY(46px);
    }
  }
  .line-to-right2{
    top: 52px;
    left: 32px;
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}
.line-base25{
  position: absolute;
  top: 678px;
  left: 913px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
.line-base26{
  position: absolute;
  top: 678px;
  left: 770px;
  .line-to-right{
    width: 90px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8 01
.line-base27{
  position: absolute;
  top: 277px;
  left: 1047px;
  .line-to-right{
    width: 29px;
    .star{
      animation-duration: 1s;
      transform: translateX(16px);
    }
  }
  .line-to-top{
    bottom: -1px;
    top: auto;
    left: 29px;
    height: 100px;
    .star{
      animation-duration: 1s;
      transform: translateY(-88px);
    }
  }
  .line-to-right2{
    bottom: 98px;
    left: 29px;
    width: 58px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}
//DT8 01 01
.line-base28{
  position: absolute;
  top: 178px;
  left: 1183px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8 01 02
.line-base29{
  position: absolute;
  top: 178px;
  left: 1315px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8 01 03
.line-base30{
  position: absolute;
  top: 178px;
  left: 1460px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
  .line-to-bottom{
    top: 0px;
    left: 59px;
    height: 100px;
    .star{
      animation-duration: 1s;
      transform: translateY(90px);
    }
  }
  .line-to-right2{
    top: 99px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(22px);
    }
  }
}
//DT8-2
.line-base31{
  position: absolute;
  top: 277px;
  left: 1047px;
  .line-to-right{
    width: 29px;
    .star{
      animation-duration: 1s;
      transform: translateX(16px);
    }
  }
  .line-to-bottom{
    left: 53px;
    height: 14px;
    .star{
      animation-delay: 1s;
      animation-duration: 0.5s;
      transform: translateY(5px);
    }
  }
  .line-to-right2{
    bottom: -1px;
    left: 29px;
    width: 58px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}
//DT8-2 01
.line-base32{
  position: absolute;
  top: 277px;
  left: 1183px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8-2 02
.line-base33{
  position: absolute;
  top: 277px;
  left: 1314px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8-2 03
.line-base34{
  position: absolute;
  top: 277px;
  left: 1460px;
  .line-to-right{
    width: 60px;
    .star{
      animation-duration: 1s;
      transform: translateX(46px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 61px;
    height: 14px;
  }
  .line-to-right2{
    bottom: -1px;
    left: 60px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(22px);
    }
  }
}
//DT8-3
.line-base35{
  position: absolute;
  top: 277px;
  left: 1047px;
  .line-to-right{
    width: 29px;
    .star{
      animation-duration: 1s;
      transform: translateX(16px);
    }
  }
  .line-to-bottom{
    left: 29px;
    height: 102px;
    .star{
      animation-duration: 1.3s;
      transform: translateY(88px);
    }
  }
  .line-to-right2{
    bottom: -102px;
    left: 29px;
    width: 58px;
    .star{
      animation-duration: 1s;
      transform: translateX(50px);
    }
  }
}
//DT8-3 01
.line-base36{
  position: absolute;
  top: 378px;
  left: 1183px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8-3 02
.line-base37{
  position: absolute;
  top: 378px;
  left: 1315px;
  .line-to-right{
    width: 89px;
    .star{
      animation-duration: 1s;
      transform: translateX(80px);
    }
  }
}
//DT8-3 03
.line-base38{
  position: absolute;
  top: 378px;
  left: 1458px;
  .line-to-right{
    width: 62px;
    .star{
      animation-duration: 1s;
      transform: translateX(56px);
    }
  }
  .line-to-top{
    bottom: 0px;
    top: auto;
    left: 61px;
    height: 101px;
    .star{
      animation-duration: 1.3s;
      transform: translateY(-88px);
    }
  }
  .line-to-right2{
    bottom: 100px;
    left: 62px;
    width: 32px;
    .star{
      animation-duration: 1s;
      transform: translateX(26px);
    }
  }
}
/*浮框*/
// .pop-box{
//   position: absolute;
//   border:1px solid $line-success;
//   padding:0 4px;
//   left: 0;
//   right: 0;
//   .pop-txt{
//     line-height: 16px;
//     width: 40px;
//   }
//   .tooltip-wrap{
//     bottom: 2px;
//     top: auto;
//     left: 50%;
//     transform: translateX(-50%);
//   }
//   .panel-tooltip{
//     .tooltip-bd{
//       background-color: #F1FDFB;
//     }
//   }
// }

// 高清图片设置
// background-image: url(../images/arw.png);
// background-image: -webkit-image-set(url(../images/arw.png) 1x,url(../images/arw@2x.png) 2x);
// background-image: image-set(url(../images/arw.png) 1x,url(../images/arw@2x.png) 2x);








